/*首页动画*/
.containerface {
    position: relative;
    width: 740px;
    height: 510px;
    overflow: hidden; /* 确保超出部分隐藏 */
}

/* 背景图片容器 */
.facebg-image {
    position: absolute;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover; /* 使用cover以确保图片覆盖容器 */
}

/* 左侧图片（固定显示） */
#facebg-left {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face11.png');
}

/* 右侧图片（动画显示） */
#facebg-right {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face12.png');
    animation: slideIn 6s infinite linear;
}

/* 分隔线 */
.facedivider {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: white;
    z-index: 3; /* 确保分隔线在最上层 */
    animation: movefacedivider 6s infinite linear;
}

/* 从左到右的滑动动画 */
@keyframes slideIn {
    from { clip-path: inset(0 100% 0 0); } /* 完全隐藏 */
    to { clip-path: inset(0 0 0 0); } /* 完全显示 */
}

/* 分隔线移动动画 */
@keyframes movefacedivider {
    from { left: 0; }
    to { left: 100%; }
}

/* 第二组图片（隐藏状态） */
#facebg-left2 {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face13.png');
    display: none;
}

#facebg-right2 {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face14.png');
    display: none;
    animation: slideIn 6s infinite linear;
}

/* 左侧图片（固定显示） */
#facebg-left-1 {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face15.png');
}

/* 右侧图片（动画显示） */
#facebg-right-1 {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face16.png');
    animation: slideIn 6s infinite linear;
}
/* 第二组图片（隐藏状态） */
#facebg-left2div {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face17.png');
    display: none;
}

#facebg-right2div {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face18.png');
    display: none;
    animation: slideIn 6s infinite linear;
}

/* 左侧图片（固定显示） */
#facebg-left-13 {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face19.png');
}

/* 右侧图片（动画显示） */
#facebg-right-13 {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face20.png');
    animation: slideIn 6s infinite linear;
}
/* 第二组图片（隐藏状态） */
#facebg-left3div {
    z-index: 1;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face21.png');
    display: none;
}

#facebg-right3div {
    z-index: 2;
    background-image: url('https://www.chuangziyou.com/wp-content/uploads/2025/mobieimages/face22.png');
    display: none;
    animation: slideIn 6s infinite linear;
}